<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="../jquery/jquery-3.6.0.min.js"></script>
    <link rel="stylesheet" href="../bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="../css/department.css">

    <script src="../bootstrap/js/bootstrap.min.js"></script>
    <script src="../data/data.js"></script>
</head>

<!-- 修改部门 -->
<div>
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="myModalLabel">部门管理</h4>
                </div>
                <div class="modal-body">
                    <form class="form-horizontal">
                        <div class="form-group form-group-sm">
                            <label class="col-sm-2 control-label" for="formGroupInputSmall">编号</label>
                            <div class="col-sm-8">
                                <input class="form-control addVal" type="text" id="formGroupInputSmall" placeholder="" name="department_id" readonly>
                            </div>
                        </div>
                        <div class="form-group form-group-sm">
                            <label class="col-sm-2 control-label" for="formGroupInputSmall">部门名称</label>
                            <div class="col-sm-8">
                                <input class="form-control addVal" type="text" id="formGroupInputSmall" placeholder="" value="" name="department_place">
                            </div>
                        </div>
                        <div class="form-group form-group-sm">
                            <label class="col-sm-2 control-label" for="formGroupInputSmall">负责人姓名</label>
                            <div class="col-sm-8">
                                <input class="form-control addVal" type="text" id="formGroupInputSmall" placeholder="" value="" name="department_name">
                            </div>
                        </div>
                        <div class="form-group form-group-sm">
                            <label class="col-sm-2 control-label" for="formGroupInputSmall">电话</label>
                            <div class="col-sm-8">
                                <input class="form-control addVal" type="text" id="formGroupInputSmall" placeholder="" value="" name="department_tel">
                            </div>
                        </div>
                        <div class="form-group form-group-sm">
                            <label class="col-sm-2 control-label" for="formGroupInputSmall">部门人数</label>
                            <div class="col-sm-8">
                                <input class="form-control addVal" type="text" id="formGroupInputSmall" placeholder="" value="" name="department_num">
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary queding" data-dismiss="modal">确定</button>
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- 添加部门 -->
<div>
    <div class="modal fade" id="myModall" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="myModalLabel">添加部门</h4>
                </div>
                <div class="modal-body">
                    <form class="form-horizontal">
                        <div class="form-group form-group-sm">
                            <label class="col-sm-2 control-label" for="formGroupInputSmall">编号</label>
                            <div class="col-sm-8">
                                <input class="form-control val" type="text" id="formGroupInputSmall" placeholder="" name="new department_id" readonly>
                            </div>
                        </div>
                        <div class="form-group form-group-sm">
                            <label class="col-sm-2 control-label" for="formGroupInputSmall">部门名称</label>
                            <div class="col-sm-8">
                                <select name="new department_place" id="" class="form-control val">
                                    <option value="">1</option>
                                    <option value="">2</option>
                                </select>
                                <input class="form-control val" type="text" id="formGroupInputSmall" placeholder="" value="" name="new department_place">
                            </div>
                        </div>
                        <div class="form-group form-group-sm">
                            <label class="col-sm-2 control-label" for="formGroupInputSmall">负责人姓名</label>
                            <div class="col-sm-8">
                                <input class="form-control val" type="text" id="formGroupInputSmall" placeholder="" value="" name="new department_name">
                            </div>
                        </div>
                        <div class="form-group form-group-sm">
                            <label class="col-sm-2 control-label" for="formGroupInputSmall">电话</label>
                            <div class="col-sm-8">
                                <input class="form-control val" type="text" id="formGroupInputSmall" placeholder="" value="" name="new department_tel">
                            </div>
                        </div>
                        <div class="form-group form-group-sm">
                            <label class="col-sm-2 control-label" for="formGroupInputSmall">部门人数</label>
                            <div class="col-sm-8">
                                <input class="form-control val" type="text" id="formGroupInputSmall" placeholder="" value="" name="new department_num">
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary determine" data-dismiss="modal">确定</button>
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                </div>
            </div>
        </div>
    </div>
</div>

<h2 id="title">部门管理</h2>
<div>
    <div class="nav">
        <h4>所有部门</h4> <button type="button" class="btn btn-primary addTo" data-toggle="modal" data-target="#myModall">添加部门</button>
    </div>
    <div id="content">
        <table class="table table-bordered">
            <thead>
                <tr>
                    <th>编号</th>
                    <th>部门名称</th>
                    <th>负责人姓名</th>
                    <th>电话</th>
                    <th>部门人数</th>
                    <th>操作</th>
                </tr>
            </thead>
            <tbody id="tbody">
            </tbody>
        </table>
        <nav aria-label="Page navigation example" style="display: flex;align-items: center;justify-content: space-between;height: 74px;">
            <div id="page-text">

            </div>
            <div style="display: flex;align-items: center">
                <ul class="pagination">
                    <li class="page-item" id="pre">
                        <a class="page-link" href="#" aria-label="Previous">
                            <span aria-hidden="true" id="pre">&laquo;</span>
                        </a>
                    </li>
                    <li class="page-item pages">

                    </li>
                    <li class="page-item" id="next">
                        <a class="page-link" href="#" aria-label="Next">
                            <span aria-hidden="true" id="next">&raquo;</span>
                        </a>
                    </li>
                </ul>

            </div>
        </nav>


    </div>

</div>
<script src="../js/departemnt.js"></script>

<body>

</body>

</html>